<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>Show all the users</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>

    <div th:if="${userList}">
    <div>
        There are <span th:text="${#lists.size(userList)}"></span> user(s).
        <table class="table table-bordered table-hover table-striped">
            <thead>
                <tr>
                <th>ID</th>
                <th>Name</th>
                <th>Lang</th>
                <th>eMail</th>
                </tr>
            </thead>
            <tbody>
                <tr th:each="currentUser, stat : ${userList}">
                    <td th:text="${currentUser.getId()}" ></td>
                    <td th:text="${currentUser.getUsername()}" ></td>
                    <td th:text="${currentUser.getLanguage()}"></td>
                    <td th:text="${currentUser.getEmail()}" ></td>
                </tr>
            </tbody>
        </table>
    </div>
    </div>

    <h1>Add a user</h1>
    <form action="#" th:action="@{/user/add}"  method="post">
        <p>Name: <input type="text" name="userName" /></p>
        <p>Password: <input type="text" name="password" /></p>
        <p>FullName: <input type="text" name="fullName" /></p>
        <p>email: <input type="text" name="email" /></p>

        UserType:
        <select name="usertype">
           <option value ="1">Built-in</option>
           <option value ="2" selected="selected">Added</option>
           <option value ="3">LDAP</option>
        </select> <br/>

        Deletable:<input type="checkbox" name="can_detele" checked="checked" /> <br/>

        DateFormat:
        <select name="dateformat">
           <option value ="yyyy-MM-dd">yyyy-MM-dd</option>
           <option value ="yyyy/MM/dd" selected="selected">yyyy/MM/dd</option>
           <option value ="yy-MM-dd">yy-MM-dd</option>
        </select> <br/>
    
        TimeFormat:
        <select name="timeforamt">
           <option value ="HH:mm:ss" selected="selected">HH:mm:ss</option>
           <option value ="hh:mm:ss a zzz">hh:mm:ss a zzz</option>
           <option value ="HH:mm:ss Z">HH:mm:ss Z</option>
           <option value ="hh:mm aaa">hh:mm aaa</option>
        </select> <br/>

        TimeZone:
        <select name="timezone">
            <option  th:each="zone:${timezoneList}" th:value="${zone}" th:text="${zone}"></option>
        </select> <br/>

        Language:
        <select name="language">
           <option value ="zh_CN">zh_CN</option>
           <option value ="en_US" selected="selected">en_US</option>
           <option value ="ja_JP">ja_JP</option>
        </select> <br/>

        <p><input type="submit" value="Submit" /> <input type="reset" value="Reset" /></p>
    </form>


    <a th:href="@{/home}">回到主页</a>
</body>
</html>